<div class="sub-main-container">
    <div class="search-wrap">
        <form nz-form [nzLayout]="'inline'" [formGroup]="searchForm">
            <nz-form-item>
                <nz-form-label>管理单位</nz-form-label>
                <nz-form-control>
                    <nz-select formControlName="stationId" [nzAllowClear]="false" nzPlaceHolder="管理所"
                               style="width: 170px;" (ngModelChange)="getSectionList()">
                        <nz-option nzLabel="跃进渠一所" nzValue="168"></nz-option>
                        <nz-option nzLabel="跃进渠二所" nzValue="169"></nz-option>
                    </nz-select>
                </nz-form-control>
            </nz-form-item>
            <nz-form-item>
                <nz-form-label>所段</nz-form-label>
                <nz-form-control>
                    <nz-select formControlName="sectionId" nzAllowClear nzPlaceHolder="所段"
                               style="width: 170px;">
                        <nz-option *ngFor="let option of sectionList" [nzLabel]='option.manageName'
                                   [nzValue]="option.id"></nz-option>
                    </nz-select>
                </nz-form-control>
            </nz-form-item>
            <nz-form-item>
                <nz-form-control>
                    <button nz-button nzType="primary" (click)="queryInfo(true)"><i nz-icon nzType="search"></i>查询
                    </button>
                </nz-form-control>
            </nz-form-item>
        </form>
    </div>
    <div class="main-wrap">
        <div class="right-panel">
            <nz-table #dataTable
                      class="main-table"
                      [nzData]="tableData"
                      [nzTotal]="total"
                      [nzFrontPagination]="false"
                      [(nzPageIndex)]="pageNum"
                      [(nzPageSize)]="pageSize"
                      [nzLoading]="loading"
                      [nzScroll]="{ y: 'calc(100vh - 350px)' }"
                      (nzPageIndexChange)="queryInfo()"
                      nzBordered
                      nzSize="middle">
                <thead>
                <tr>
                    <th nzWidth="125px">序号</th>
                    <th>视频监控名称</th>
                </tr>
                </thead>
                <tbody>
                <tr *ngFor="let data of dataTable.data; let idx = index">
                    <td>{{pageSize * (pageNum - 1) + idx + 1}}</td>
                    <td>
                        <a (click)="startPreview(data)">{{ data.name }}</a>
                    </td>
                </tr>
                </tbody>
            </nz-table>
        </div>
        <div class="left-panel">
            <div id="playWnd" class="playWnd" style="width: 1000px;height: 600px"></div>
        </div>
    </div>

</div>
